<template>
	<view class="line-hei-30 clearfix">
		<uni-swiper-dot :info="shouylbtList" :current="current" field="content" :mode="mode">
			<swiper class="swiper-box" @change="change" autoplay>
				<swiper-item v-for="(item ,index) in shouylbtList" :key="index">
					<view class="swiper-item">
						<image style="width:100%;" mode="scaleToFill" :src="item.itemValue"></image>
					</view>
				</swiper-item>
			</swiper>
		</uni-swiper-dot>

		<!-- <uni-card class="icon-radius font-bold" title="已入会员" :isShadow="true" extra="最新入会信息100人">
			<swiper autoplay circular vertical :disable-touch="true" :touchable="false">
				<swiper-item v-for="(item, index) in soldList" :key="index">
					<div class="botder-bottom-gray" v-for="(item2, index2) in item.subList" :key="index2" style="font-size: 12px;">
						<uni-row>
						    <uni-col :span="12">
						        {{item2.pinp + ", " + item2.chex}}
						    </uni-col>
						    <uni-col :span="6">
						        车主：{{item2.beibxr}}
						    </uni-col>
						    <uni-col :span="6">
						        {{item2.chuangjsj}}
						    </uni-col>
						</uni-row>
					</div>
				</swiper-item>
			</swiper>
		</uni-card> -->

		<div class="clear h10"></div>
		<div class="clear h10"></div>
		<block v-if="isGetPhoneNumber == true">
			<button type="primary" open-type="getPhoneNumber" style="width: 90%;"
				@getphonenumber="getPhoneNumber">立即加入酷车俱乐部会员</button>
		</block>
		<block v-else>
			<button type="primary" class="btn-red" style="width: 90%;" @click="baofss">立即加入酷车俱乐部会员</button>
		</block>

		<!-- <uni-section class="pub-title" title="当前城市" type="line">
			<picker @change="bindPickerChange" :value="cityIndex" :range="cityList" range-key="itemText">
				<view class="uni-input">{{ cityList[cityIndex].itemText }}</view>
			</picker>
		</uni-section> -->

		<!-- <uni-card class="font-bold" title="产品列表" :isShadow="true">
			<uni-list v-for="(item,index) in chanpList" class="img-128">
				<uni-list-item clickable @click="click(item.chanpId)" :title="item.chanpmc" :note="item.chanpms"
					:thumb="item.chanpzt" thumb-size="lg"></uni-list-item>
			</uni-list>
		</uni-card> -->

		<uni-section class="pub-title" title="会员介绍" type="line"></uni-section>

		<uni-card class="icon-radius font-bold" title="为什么要加入酷车俱乐部?" :isShadow="true">
			<div v-for="(item,index) in weismymybList" :key="index">
				<p>{{item.itemValue}}</p>
			</div>
		</uni-card>
		
		<div class="clear"></div>
		<div class="padding15L padding15R clearfix">
			<image style="width:100%;" class="rad5" mode="aspectFit" :src="shouyzst[0].itemValue"></image>
		</div>
		
		<!-- <block v-if="isGetPhoneNumber == true">
			<button type="primary" open-type="getPhoneNumber" style="width: 90%;"
				@getphonenumber="getPhoneNumber2">邀请好友成为会员获得300元奖励</button>
		</block>
		<block v-else>
			<button type="primary" class="btn-red" style="width: 90%;" @click="yaoqhy">邀请好友成为会员获得300元奖励</button>
		</block> -->
		
		<uni-card class="icon-radius font-bold" title="为什么现在就加入酷车俱乐部?" :isShadow="true">
			<div v-for="(item,index) in weismxzkybList" :key="index">
				<p>{{item.itemValue}}</p>
			</div>

			<div class="clear h10"></div>

			<uni-row>
				<uni-col :span="12">
					<button type="primary" size="default" @click="baozfw" class="btn-red margin10R">保障范围</button>
				</uni-col>
				<uni-col :span="12">
					<button type="primary" size="default" @click="fuwtk" class="btn-red margin10L">服务条款</button>
				</uni-col>
			</uni-row>
		</uni-card>

		<uni-section class="pub-title" title="服务保障" type="line"></uni-section>
		<uni-card class="font-bold" title="理赔说明" :isShadow="true">
			<uni-steps active-color="#f83d38" :options="[{title: '电话/在线报修'}, {title: '检测维修'}, {title: '验收交车'}]"
				:active="2"></uni-steps>
			<div class="clear h10"></div>
			<p>1. 电话/在线报修</p>
			<p class="font-normal padding15L">拨打客户电话: 400-991-2233 或者在微信小程序中自助报修</p>
			<p>2. 检测及维修</p>
			<p class="font-normal padding15L">指定维修商，对车辆进行检测。确认维修方案后开始维修。</p>
			<p>3. 验收交车</p>
			<p class="font-normal padding15L">维修完成，验收并确认无误后。将车辆开走，无需垫付酷车俱乐部直接赔付。</p>

			<div class="clear h10"></div>

			<uni-row>
				<uni-col :span="12">
					<button type="primary" size="default" @click="makeCall" class="btn-red margin10R">电话咨询</button>
				</uni-col>
				<uni-col :span="12">
					<button type="primary" size="default" open-type="contact" class="btn-red margin10L">在线客服</button>
				</uni-col>
			</uni-row>
		</uni-card>

		<button type="primary" class="btn-red" style="width: 90%;" @click="baofss">立即加入酷车俱乐部会员</button>
		<div class="clear h10"></div>
		<div class="clear h10"></div>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				fenxtp: [],
				soldList: [],
				shouyzst: [],
				isGetPhoneNumber: false,
				weismxzkybList: [],
				weismymybList: [],
				cityIndex: uni.getStorageSync("cityIndex") == "" ? 0 : uni.getStorageSync("cityIndex"),
				cityList: [],
				shouylbtList: [],
				current: 0,
				mode: 'default',
				chanpList: []
			}
		},

		onShow() {
			// uni.setStorageSync("carInfo", null)
		},

		onShareAppMessage() {
			let openId = "";
			if (uni.getStorageSync("openId") != null)
				openId = uni.getStorageSync("openId").openid

			return {
				title: "酷车俱乐部",
				path: 'pages/home/home?shareBy=' + openId,
				imageUrl: this.fenxtp[0].itemValue
			}
		},

		onLoad(option) {
			let that = this
			let scene = null
			
			if(option.scene)
				scene = decodeURIComponent(option.scene)
			
			uni.request({
				url: getApp().globalData.serviceUrl + "/sys/dictItem/list",
				data: {
					dictId: "1453640158131376129",
				},
				dataType: 'json',
				method: 'GET',
				success: (result) => {
					if (result.data.success) {
						that.fenxtp = result.data.result.records
					}
				}
			});
			
			uni.request({
				url: getApp().globalData.serviceUrl + "/order/kuybOrder/soldList",
				data: {
				},
				dataType: 'json',
				method: 'GET',
				success: (result) => {
					if (result.data.success) {
						that.soldList = result.data.result
					}
				}
			});

			uni.request({
				url: getApp().globalData.serviceUrl + "/sys/dictItem/list",
				data: {
					dictId: "1453640158131376129",
				},
				dataType: 'json',
				method: 'GET',
				success: (result) => {
					if (result.data.success) {
						that.shouyzst = result.data.result.records
					}
				}
			});

			uni.request({
				url: getApp().globalData.serviceUrl + "/sys/dictItem/list",
				data: {
					dictId: "1448055067489423361",
				},
				dataType: 'json',
				method: 'GET',
				success: (result) => {
					if (result.data.success) {
						that.weismxzkybList = result.data.result.records
					}
				}
			});

			uni.request({
				url: getApp().globalData.serviceUrl + "/sys/dictItem/list",
				data: {
					dictId: "1448052859104481282",
				},
				dataType: 'json',
				method: 'GET',
				success: (result) => {
					if (result.data.success) {
						that.weismymybList = result.data.result.records
					}
				}
			});

			// uni.request({
			// 	url: getApp().globalData.serviceUrl + "/sys/dictItem/list",
			// 	data: {
			// 		dictId: "1435808345820295170",
			// 	},
			// 	dataType: 'json',
			// 	method: 'GET',
			// 	success: (result) => {
			// 		if (result.data.success) {
			// 			// 城市列表
			// 			that.cityList = result.data.result.records
			// 			that.getProductList()
			// 		}
			// 	}
			// });

			uni.request({
				url: getApp().globalData.serviceUrl + "/sys/dictItem/list",
				data: {
					dictId: "1438711819352440834",
				},
				dataType: 'json',
				method: 'GET',
				success: (result) => {
					if (result.data.success) {
						// 首页轮播图列表
						that.shouylbtList = result.data.result.records
					}
				}
			});

			uni.login({
				provider: 'weixin',
				success: loginRes => {
					uni.showLoading({
						title: "加载中..."
					})
					uni.request({
						url: getApp().globalData.serviceUrl + "/weixin/getOpenIdByCode",
						dataType: 'json',
						method: 'GET',
						data: {
							code: loginRes.code
						},
						success: (result) => {
							console.log(result)
							if (result.data.success) {
								uni.setStorageSync('openId', result.data.result)
								// 建立血缘关系
								if (option.shareBy)
									that.jianlixygx(option.shareBy, 0)
								if (scene)
									that.jianlixygx(scene.split("=")[1], 1)

								that.loginByOpenId()
							}
						},
						complete() {
							uni.hideLoading()
						}
					});
				}
			});

		},

		methods: {
			fuwtk() {
				uni.navigateTo({
					url: "../../pages2/fuwtk/fuwtk"
				})
			},

			baozfw() {
				uni.navigateTo({
					url: "../../pages2/baozfw/baozfw"
				})
			},

			getPhoneNumber(e) {
				let that = this
				if (e.detail.errMsg == "getPhoneNumber:fail user deny") {
					uni.showToast({
						icon: 'none',
						title: "获取手机号后才能给您更好的服务！",
						duration: 3000
					});

					return
				}
				
				this.isGetPhoneNumber = false

				uni.request({
					url: getApp().globalData.serviceUrl + "/weixin/bindMobile",
					data: {
						openId: uni.getStorageSync("openId").openid,
						sessionKey: uni.getStorageSync("openId").session_key,
						iv: e.detail.iv,
						encryptedData: e.detail.encryptedData,
					},
					dataType: 'json',
					method: 'GET',
					success: (result) => {
						if (result.data.success) {
							uni.setStorageSync("token", result.data.result.token)
							uni.setStorageSync("userInfo", result.data.result)

							that.baofss()
						}
					}
				});
			},
			
			getPhoneNumber2(e) {
				let that = this
				if (e.detail.errMsg == "getPhoneNumber:fail user deny") {
					uni.showToast({
						icon: 'none',
						title: "获取手机号后才能给您更好的服务！",
						duration: 3000
					});
			
					return
				}
				
				this.isGetPhoneNumber = false
			
				uni.request({
					url: getApp().globalData.serviceUrl + "/weixin/bindMobile",
					data: {
						openId: uni.getStorageSync("openId").openid,
						sessionKey: uni.getStorageSync("openId").session_key,
						iv: e.detail.iv,
						encryptedData: e.detail.encryptedData,
					},
					dataType: 'json',
					method: 'GET',
					success: (result) => {
						if (result.data.success) {
							uni.setStorageSync("token", result.data.result.token)
							uni.setStorageSync("userInfo", result.data.result)
			
							uni.navigateTo({
								url: '../../pages2/share2Friend/share2Friend'
							})
						}
					}
				});
			},

			loginByOpenId() {
				let that = this
				let openId = uni.getStorageSync("openId").openid
				
				uni.request({
					url: getApp().globalData.serviceUrl + "/sys/loginByOpenId",
					data: {
						openId: openId
					},
					dataType: 'json',
					method: 'GET',
					success: (result) => {
						if (result.data.success) {
							that.isGetPhoneNumber = false
							uni.setStorageSync("token", result.data.result.token)
							uni.setStorageSync("userInfo", result.data.result)

						} else {
							that.isGetPhoneNumber = true
						}
					}
				});
			},

			baofss() {
				uni.navigateTo({
					url: '../../pages2/baofShis/baofShis',
					fail(e) {
						console.log(e)
					}
				})
			},

			jianlixygx(shareBy, type) {
				uni.request({
					url: getApp().globalData.serviceUrl + "/myteam/kuybTeam/bloodRelationship",
					data: {
						type: type,
						shareBy: shareBy,
						myOpenId: uni.getStorageSync('openId').openid
					},
					method: 'GET',
					success: (resp) => {
						if (resp.data.success) {

						}
					}
				});

			},

			yaoqhy() {
				uni.navigateTo({
					url: '../../pages2/share2Friend/share2Friend'
				})
			},

			getProductList() {
				uni.request({
					url: getApp().globalData.serviceUrl + "/chanpCity/kuybChanpCity/list",
					data: {
						city: this.cityList[this.cityIndex].itemValue
					},
					method: 'GET',
					success: (resp) => {
						if (resp.data.success) {
							this.chanpList = resp.data.result.records
						}
					},

				})
			},

			bindPickerChange: function(e) {
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.cityIndex = e.target.value
				uni.setStorageSync("cityIndex", e.target.value)

				this.getProductList()
			},

			makeCall() {
				uni.makePhoneCall({
					phoneNumber: '4009912233'
				});
			},

			change(e) {
				this.current = e.detail.current;
			},

			click(productId) {
				uni.setStorageSync("city", this.cityList[this.cityIndex].itemValue)
				uni.navigateTo({
					url: '../../pages2/productDetail/productDetail?productId=' + productId
				})
			}
		}
	}
</script>

<style>
	swiper {
		display: block;
		height: 240px;
	}

	.uni-list--lg {
		height: 128rpx;
		width: 128rpx;
	}
</style>
